<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page import="com.cdvtc.flower.model.Products" %>
<%@ page import="com.cdvtc.flower.dao.impl.ProductsDaoImpl" %>
<%@ page import="java.util.List" %>
<%@ page import="com.cdvtc.flower.dao.ProductsDao" %><%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2024/5/21
  Time: 14:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title></title>
    <meta name="robots" content="noindex, follow"/>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- CSS
	============================================ -->

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="tool/assets/css/vendor/bootstrap.min.css">
    <!-- Icon Font CSS -->

    <link rel="stylesheet" href="tool/assets/css/vendor/ionicons.min.css">

    <!-- Plugins CSS -->
    <link rel="stylesheet" href="tool/assets/css/plugins/slick.css">
    <link rel="stylesheet" href="tool/assets/css/plugins/animation.css">
    <link rel="stylesheet" href="tool/assets/css/plugins/jqueryui.min.css">

    <!-- Vendor & Plugins CSS (Please remove the comment from below vendor.min.css & plugins.min.css for better website load performance and remove css files from avobe) -->
    <!--
    <script src="assets/js/vendor/vendor.min.js"></script>
    <script src="assets/js/plugins/plugins.min.js"></script>
    -->

    <!-- Main Style CSS (Please use minify version for better website load performance) -->
    <link rel="stylesheet" href="tool/assets/css/style.css">
    <!--<link rel="stylesheet" href="assets/css/style.min.css">-->

</head>

<body>

<div class="main-wrapper">

    <header class="fl-header">

        <!-- Header Top Start -->
        <div class="header-top-area d-none d-lg-block">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="header-top-inner">
                            <div class="row">
                                <div class="col-lg-4 col-md-3">
                                    <div class="social-top">
                                        <ul>
                                            <li><a href="#"><i class="ion-social-facebook"></i></a></li>
                                            <li><a href="#"><i class="ion-social-twitter"></i></a></li>
                                            <li><a href="#"><i class="ion-social-tumblr"></i></a></li>
                                            <li><a href="#"><i class="ion-social-googleplus"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="col-lg-8 col-md-9">
                                    <div class="top-info-wrap text-right">
                                        <ul class="top-info">
                                            <li>周一 - 周五 : 9am to 5pm</li>
                                            <li><a href="#">+19108069904</a></li>
                                            <li><a href="#">花卉电商@gmail.com</a></li>
                                            <c:if test="${not empty sessionScope.customer}">
                                                <li class="dropdown">
                                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                                                       aria-expanded="false">${sessionScope.customer.user_name}<span class="caret"></span></a>
                                                    <ul class="dropdown-menu">
                                                        <li><a href="log-out">退出</a></li>
                                                        <li><a href="orders.jsp">订单</a> </li>
                                                    </ul>
                                                </li>
                                            </c:if>
                                            <c:if test="${empty sessionScope.customer}">
                                                <li><a href="login.jsp">登陆</a></li>
                                            </c:if>
                                            <li><a href="register.jsp">注册</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Header Top End -->

        <!-- haeader bottom Start -->
        <div class="haeader-bottom-area">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-2 col-md-4 col-5">
                        <div class="logo-area">
                            <a href="index.jsp"><img src="jsp/assets/images/logo/logo.png" alt=""></a>
                        </div>
                    </div>
                    <div class="col-lg-8 d-none d-lg-block">
                        <div class="main-menu-area text-center">
                            <!--  Start Mainmenu Nav-->
                            <nav class="main-navigation">
                                <ul>
                                    <li><a href="index.jsp"> 首页 </a></li>
                                    <li><a href="shop.jsp"> 商品列表 </a>
                                    <li><a href="product-details.jsp"> 商品详细 </a></li>
                                </ul>
                            </nav>

                        </div>
                    </div>

                    <div class="col-lg-2 col-md-8 col-7">
                        <jsp:include page="commons/navbar.jsp"></jsp:include>
                    </div>
                </div>
            </div>
        </div>
        <!-- haeader bottom End -->

        <!-- main-search start -->
        <div class="main-search-active">
            <div class="sidebar-search-icon">
                <button class="search-close"><span class="ion-android-close"></span></button>
            </div>
            <div class="sidebar-search-input">
                <form>
                    <div class="form-search">
                        <input id="search" class="input-text" value="" placeholder="Search entire store here ..."
                               type="search">
                        <button class="search-btn" type="button">
                            <i class="ion-ios-search"></i>
                        </button>
                    </div>
                </form>
            </div>
        </div>
        <!-- main-search start -->


        <!-- off-canvas menu start -->
        <!-- off-canvas menu end -->


    </header>


    <!-- breadcrumb-area start -->
    <div class="breadcrumb-area section-ptb">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <h2 class="breadcrumb-title">商品列表</h2>
                    <!-- breadcrumb-list start -->
                    <ul class="breadcrumb-list">
                        <li class="breadcrumb-item"><a href="index.jsp">首页</a></li>
                        <li class="breadcrumb-item active">商品列表</li>
                    </ul>
                    <!-- breadcrumb-list end -->
                </div>
            </div>
        </div>
    </div>
    <!-- breadcrumb-area end -->


    <!-- main-content-wrap start -->
    <div class="main-content-wrap shop-page section-ptb">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 order-lg-1 order-2">
                    <!-- shop-sidebar-wrap start -->
                    <div class="shop-sidebar-wrap">

                        <!-- shop-sidebar start -->
                        <div class="shop-sidebar mb-30">
                            <h4 class="title">分类</h4>
                            <ul>
                                <li><a href="shop.jsp">送恋人 <span>(18)</span></a></li>
                                <li><a href="shop.jsp">送病人 <span>(16)</span></a></li>
                                <li><a href="shop.jsp">送客户 <span>(6)</span></a></li>
                                <li><a href="shop.jsp">送亲人 <span>(11)</span></a></li>
                            </ul>
                        </div>
                        <!-- shop-sidebar end -->


                        <!-- shop-sidebar start -->
                        <%--                       尚未修改  best product--%>
                        <div class="sidbar-product shop-sidebar mb-30">
                            <h4 class="title">热销</h4>
                            <%
                                // 实例化ProductsDao
                                ProductsDao productsDao = new ProductsDaoImpl();
                                // 获取所有产品
                                List<Products> allProducts = productsDao.getAllProducts();
                                // 假设你只想取出前3个产品
                                int maxIterations = 3;
                                List<Products> firstFewProducts;
                                // 检查是否有足够的产品来创建子列表
                                if (allProducts != null && !allProducts.isEmpty() && allProducts.size() >= maxIterations) {
                                    // 创建一个只包含前maxIterations个产品的新列表
                                    firstFewProducts = allProducts.subList(0, maxIterations);
                                } else {
                                    // 如果产品少于maxIterations个，就使用全部产品
                                    firstFewProducts = allProducts;
                                }
                                // 将处理后的产品列表设置为页面属性
                                pageContext.setAttribute("products", firstFewProducts);
                                // 假设products是从后端传递到页面的List对象
                                List<?> products = (List<?>) request.getAttribute("products");
                                if (products != null && products.size() > maxIterations) {
                                    // 创建一个新的、大小受限的列表
                                    List<?> limitedProducts = products.subList(0, maxIterations);
                                    // 将这个大小受限的列表设置为一个新的属性，以便在<c:forEach>中使用
                                    pageContext.setAttribute("limitedProducts", limitedProducts);
                                } else {
                                    // 如果产品数量不多于maxIterations，则直接使用原始列表
                                    pageContext.setAttribute("limitedProducts", products);
                                }
                            %>
                            <!-- sidbar-product-inner start -->
                            <c:forEach var="product" items="${products}">
                                <div class="sidbar-product-inner">
                                    <div class="product-image">
                                        <a href="product-details.jsp?id=${product.product_id}"><img
                                                src="tool/assets/images/product/${product.image}" alt=""></a>
                                    </div>
                                    <div class="product-content text-left">
                                        <h3><a href="product-details.jsp">${product.product_name}</a></h3>
                                        <div class="price-box">
                                            <span class="old-price">${product.original_price}</span>
                                            <span class="new-price">${product.sale_price}</span>
                                        </div>
                                    </div>
                                </div>
                            </c:forEach>
                            <!-- sidbar-product-inner end -->

                        </div>
                        <!-- shop-sidebar end -->

                        <!-- shop-sidebar start -->
                        <div class="shop-sidebar mb-30">
                            <h4 class="title">颜色</h4>
                            <ul>
                                <li><a href="shop.jsp">红 <span>(18)</span></a></li>
                                <li><a href="shop.jsp">绿 <span>(16)</span></a></li>
                                <li><a href="shop.jsp">蓝 <span>(6)</span></a></li>
                                <li><a href="shop.jsp">黄 <span>(11)</span></a></li>
                                <li><a href="shop.jsp">白 <span>(11)</span></a></li>
                            </ul>
                        </div>
                        <!-- shop-sidebar end -->

                        <!-- shop-sidebar start -->
                        <div class="shop-sidebar mb-30">
                            <h4 class="title">尺码</h4>
                            <ul>
                                <li><a href="shop.jsp">S <span>(11)</span></a></li>
                                <li><a href="shop.jsp">M <span>(13)</span></a></li>
                                <li><a href="shop.jsp">L <span>(6)</span></a></li>
                                <li><a href="shop.jsp">XLL <span>(51)</span></a></li>
                                <li><a href="shop.jsp">XXL <span>(3)</span></a></li>
                            </ul>
                        </div>
                        <!-- shop-sidebar end -->

                        <!-- shop-sidebar start -->
                        <div class="shop-sidebar">
                            <h4 class="title">热门标签</h4>
                            <div class="sidebar-tag">
                                <a href="#">红</a>
                                <a href="#">蓝</a>
                                <a href="#">男士</a>
                                <a href="#">白</a>
                                <a href="#">黄</a>
                                <a href="#">女士</a>
                                <a href="#">长青</a>
                            </div>
                        </div>
                        <!-- shop-sidebar end -->
                    </div>
                    <!-- shop-sidebar-wrap end -->
                </div>
                <div class="col-lg-9 order-lg-2 order-1">
                    <!-- shop-product-wrapper start -->
                    <div class="shop-product-wrapper">
                        <div class="row">
                            <div class="col">
                                <!-- shop-top-bar start -->
                                <div class="shop-top-bar">
                                    <!-- product-view-mode start -->

                                    <div class="product-mode">
                                        <!--shop-item-filter-list-->
                                        <ul class="nav shop-item-filter-list" role="tablist">
                                            <li class="active"><a class="active" data-toggle="tab" href="#grid"><i
                                                    class="ion-ios-keypad-outline"></i></a></li>
                                            <li><a data-toggle="tab" href="#list"><i
                                                    class="ion-ios-list-outline"></i></a></li>
                                        </ul>
                                        <!-- shop-item-filter-list end -->
                                    </div>
                                    <!-- product-view-mode end -->
                                    <!-- product-short start -->
                                    <div class="product-short">
                                        <select class="nice-select" name="sortby">
                                            <option value="trending">Relevance</option>
                                            <option value="sales">Name(A - Z)</option>
                                            <option value="sales">Name(Z - A)</option>
                                            <option value="rating">Price(Low > High)</option>
                                            <option value="date">Rating(Lowest)</option>
                                        </select>
                                    </div>
                                    <!-- product-short end -->
                                </div>
                                <!-- shop-top-bar end -->
                            </div>
                        </div>

                        <!-- shop-products-wrap start -->
                        <div class="shop-products-wrap">
                            <%
                                List<Products> product;
                                product = productsDao.getAllProducts();
                                pageContext.setAttribute("product", product);
                            %>
                            <div class="tab-content">
                                <div class="tab-pane active" id="grid">
                                    <div class="shop-product-wrap">
                                        <div class="row">
                                            <c:forEach var="product" items="${product}">
                                                <div class="col-lg-4 col-md-4 col-sm-6">
                                                    <!-- single-product-wrap start -->
                                                    <div class="single-product-wrap">
                                                        <div class="product-image">
                                                            <a href="product-details.jsp?id=${product.product_id}"><img
                                                                    src="tool/assets/images/product/${product.image}"
                                                                    alt="Produce Images"></a>
                                                            <div class="product-action">
                                                                <form action="AddToCartServlet2" method="post">
                                                                    <!-- 隐藏字段，用于传递产品ID或其他唯一标识符 -->
                                                                    <input type="hidden" name="productId" value="${product.product_id}" />
                                                                    <button type="submit" class="add-to-cart">
                                                                        <i class="ion-bag"></i>
                                                                    </button>
                                                                </form>
                                                                <form action="AddToLoveServlet" method="post">
                                                                    <!-- 隐藏字段，用于传递产品ID或其他唯一标识符 -->
                                                                    <input type="hidden" name="productId" value="${product.product_id}" />
                                                                    <button type="submit" class="wishlist">
                                                                        <i class="ion-android-favorite-outline"></i>
                                                                    </button>
                                                                </form>
                                                            </div>
                                                        </div>
                                                        <div class="product-content">
                                                            <h3>
                                                                <a href="product-details.jsp">${product.product_name}</a>
                                                            </h3>
                                                            <div class="price-box">
                                                                <span class="old-price">${product.original_price}</span>
                                                                <span class="new-price">${product.sale_price}</span>
                                                            </div>
                                                        </div>
                                                    </div>

                                                </div>
                                            </c:forEach>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- shop-products-wrap end -->

                    <!-- paginatoin-area start -->
                    <div class="paginatoin-area">
                        <div class="row">
                            <div class="col-lg-12 col-md-12">
                                <ul class="pagination-box">
                                    <li><a class="Previous" href="#"><i class="ion-chevron-left"></i></a>
                                    </li>
                                    <li class="active"><a href="#">1</a></li>
                                    <li><a href="#">2</a></li>
                                    <li><a href="#">3</a></li>
                                    <li><a href="#">4</a></li>
                                    <li>
                                        <a class="Next" href="#"><i class="ion-chevron-right"></i> </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!-- paginatoin-area end -->
                </div>
                <!-- shop-product-wrapper end -->
            </div>
        </div>
    </div>
</div>
<!-- main-content-wrap end -->


<footer>
    <div class="footer-bottom">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="copy-right-text text-center">
                        <p>Copyright &copy; 2019.Company name All rights reserved.<a target="_blank"
                                                                                     href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</footer>


</div>

<!-- JS
============================================ -->

<!-- Modernizer JS -->
<script src="jsp/assets/js/vendor/modernizr-3.6.0.min.js"></script>
<!-- jQuery JS -->
<script src="jsp/assets/js/vendor/jquery-3.3.1.min.js"></script>
<!-- Bootstrap JS -->
<script src="jsp/assets/js/vendor/popper.min.js"></script>
<script src="jsp/assets/js/vendor/bootstrap.min.js"></script>

<!-- Slick Slider JS -->
<script src="jsp/assets/js/plugins/slick.min.js"></script>
<!--  Jquery ui JS -->
<script src="jsp/assets/js/plugins/jqueryui.min.js"></script>
<!--  Scrollup JS -->
<script src="jsp/assets/js/plugins/scrollup.min.js"></script>
<script src="jsp/assets/js/plugins/ajax-contact.js"></script>

<!-- Vendor & Plugins JS (Please remove the comment from below vendor.min.js & plugins.min.js for better website load performance and remove js files from avobe) -->
<!--
<script src="assets/js/vendor/vendor.min.js"></script>
<script src="assets/js/plugins/plugins.min.js"></script>
-->

<!-- Main JS -->
<script src="jsp/assets/js/main.js"></script>

</body>

</html>
